<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/view/common/schedule.jsp"%>
<!DOCTYPE html>
<html>
<link href="${basepath}/css/viewcss/main/workschedule/scheduleform.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="${basepath}/assets/my97/WdatePicker.js"></script>
<head>
    <title>预算</title>
    <meta charset="utf-8">
    <style>
    	body {
			padding: 0;
			font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
			font-size: 12px;
		}
		.toolbar{
			height:30px;
			background-color:#F5F5F5;
			border-radius:4px;
			border: 1px solid #CCC;
			padding-top:8px;
		}
		.btndiv{
			text-align:center;
		}
		.btn{
			text-align:center;
			display: inline-block; 
			width: 80px;
			height: 22px;
			border-radius:4px;
			border: 1px solid #CCC;
			background: #F5F5F5;
			color:black;
		}
		.querybtn{
			text-align:center;
			display: inline-block; 
			width: 60px;
			height: 18px;
			border-radius:4px;
			border: 1px solid #CCC;
			background: #F5F5F5;
			padding-top: 4px;
		}
		.queryinput{
			height: 22px;
		    line-height: 22px;
		    padding-right: 20px;
		    border: 1px solid #C6C6C6;
		    background-repeat: no-repeat;
		    background-position: right center;
		    background-color: #fff;
		    outline: 0;
		    width:150px;
		    border-radius:4px;
		    margin-left:10px;
		}
    </style>
    <script>
        $(function(){
        	$('#mainframe').css("height",document.body.clientHeight-40);
        })
        
        var queryBudget = function(){
        	var unit = $('#reportName option:selected').data('unit');
        	var querydate = $('#querydate').val();
        	if(unit==''){
        		return layer.msg("请先维护报表类型", {time: 3000, icon:6});
        	}
        	if(querydate==''){
        		return layer.msg("请先选择报表日期", {time: 3000, icon:6});
        	}
        	$('#mainframe').attr("src","${path}/budget/content?reportID="+$('#reportName option:selected').val()+"&reportDate="+querydate+"&reportUnit="+unit);
        	//console.log(querydate);
        	//mainframe.contentWindow.reflashReport();  
        }
        
        var saveReport = function(){
        	mainframe.contentWindow.saveReport();  
        }
        
        var onReportChange = function(){
        	$('#querydate').val('');
        	var unit = $('#reportName option:selected').data('unit');
        	$('#querydate').unbind("focus");
        	if(unit==1){
        		$('#querydate').bind('focus', function () { WdatePicker({ dateFmt: 'yyyy', autoPickDate: true }); });
        	}else if(unit==2){
        		$('#querydate').bind('focus', function () { WdatePicker({ dateFmt: 'yyyy-MM', autoPickDate: true }); });
        	}else if(unit==3){
        		$('#querydate').bind('focus', function () { WdatePicker({ dateFmt: 'yyyy-MM-dd', autoPickDate: true }); });
        	}
        }
		
    </script>
</head>
<body>
	<div id="toolbar" class="toolbar">
		<label style="font-size:14px;margin-left:20px;">报表选择：</label>
		<select name="reportName" id="reportName" style="width:200px" class="queryinput" onchange="onReportChange()">
			<option value=''>请选择</option>
			<c:forEach items="${reportItem}" var="status">           
				<option value="${status.id}" data-unit="${status.unit}">${status.title}</option>
			</c:forEach> 
       		
       	</select>
		<label style="font-size:14px;margin-left:20px;">日期：</label>
		<input type="text"  class="queryinput" id="querydate">
		<a href="#" onclick="queryBudget()" class="querybtn">查询</a>
		<a href="#" onclick="saveReport()" class="querybtn">保存</a>
	</div>
	
	<iframe id="mainframe" width="100%" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no" allowtransparency="yes">
	</iframe>
</body>
</html>
